<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common/jsp/declare.jsp" %>

<!DOCTYPE html>
<html>
<head>
	<base href="<%=basePath %>" />
	<title>人员-新增</title>
	<%@ include file="/common/jsp/common.jsp" %>
	
	<script>
	function validate(form) {
		var success = true;
		$(form).find("input").each(function(){
			var _input = this;
			if (success && !$(this).val()) {
				jAlert("请填写完整信息", function(){
					_input.focus();
				});
				success = false;
			} else if ($(this).attr("name") == 'bornL' && !/\d{4}年\d{2}月\d{2}日/.test($(this).val())) {
				jAlert("出生年月格式不正确", function(){
					_input.focus();
				});
				success = false;
			}
		});
		return success;
	}

	var roomList = [];
	function loadRoom() {
		doAjax({
			url: addFromUserName("mvc/main/mainRoomList.json"),
			async: false,
			success: function(json){
				if (json && json.length) {
					roomList = json;

					var selector = $('<div id="roomList" class="full-screen-cover"></div>');
					var selectList = $('<div class="selectList"></div>');
					var buttonBar = $('<div class="buttomBar"><input type="button" value="确定" class="submit" /></div>');
					selector.append($("<div></div>").append(selectList)).append(buttonBar);
					
					for (var i = 0; i < roomList.length; i++) {
						selectList.append('<label class="bg-white"><input type="radio" name="room_id" value="' + roomList[i].id + '" class="fl" />'
								+ roomList[i].community_name + ' ' + roomList[i].dept_name + ' ' + roomList[i].building + '栋'
								+ roomList[i].unit + '单元' + roomList[i].room_num + '室</label>');
					}
					selectList.find("input[name='room_id'][value='${room.id }']").attr("checked", true);

					// 绑定确定事件
					buttonBar.find("input:button").click(function(){
						var selectId = $("input[name='room_id']:checked").val();
						// 选中值
						$("[name='roomId']").val(selectId);
						// 显示文字
						for (var i = 0; i < roomList.length; i++) {
							if (roomList[i].id == selectId) {
								$("#roomAddress").html(roomList[i].community_name + ' ' + roomList[i].dept_name + ' ' + roomList[i].building + '栋'
										+ roomList[i].unit + '单元' + roomList[i].room_num + '室');
								break;
							}
						}
						$("#roomList").hide();
						$("body").removeClass("no-scroll");
					});
					
					$("body").append(selector);
				}
			}
		});
	}
	function showRoomListToSelect() {
		if (!$("#roomList").size()) {
			loadRoom();
		} else {
			$("#roomList").show();
		}
		$("body").addClass("no-scroll");
	}

	function userDel(renterId) {
		jConfirm("确认删除？", function(yes){
			if (!yes)
				return;
			
			redirect("mvc/main/grantDel.htm?renterId=" + renterId + "&communityId=${communityId}&roomId=${roomId}");
		});
	}
	function grantList() {
		redirect("mvc/main/${communityId}/${roomId}/openGrantAdd.htm");
	}
	</script>
</head>
<body id="room" class="bg-grey">
	<div style="height: 1%;"></div>
	<form action="mvc/main/${communityId}/${roomId}/grantAdd.htm" method="post" onsubmit="return validate(this);">
		<input type="hidden" name="fromUserName" value="${param.fromUserName }" />
		<input type="hidden" name="roomId" value="${roomId}" />
		<div class="frame">
			<div class="row">
				<div id="roomAddress" class="input" placeholder="房间地址">
					${room.community_name } ${room.dept_name } ${room.building }栋${room.unit }单元${room.room_num }室
				</div>
			</div>
			<div class="row">
				<input name="nameL" value="" class="input" placeholder="姓名" option="{required: true}" />
			</div>
			<div class="row">
				<input id="sexL" name="sexL" value="" placeholder="性别" data="[{text:'男', value: '男'},{text:'女', value: '女'}]" option="{singleSelect: true, required: true}" class="checkbox" />
			</div>
			<div class="row">
				<div name="nationL" value="汉族" class="select" data="[{text:'汉族', value: 1},{text:'蒙古族', value: 2},{text:'回族', value: 3},{text:'藏族', value: 4},{text:'维吾尔族', value: 5},{text:'苗族', value: 6},{text:'彝族', value: 7},{text:'壮族', value: 8},{text:'布依族', value: 9},{text:'朝鲜族', value: 10},{text:'满族', value: 11},{text:'侗族', value: 12},{text:'瑶族', value: 13},{text:'白族', value: 14},{text:'土家族', value: 15},{text:'哈尼族', value: 16},{text:'哈萨克族', value: 17},{text:'傣族', value: 18},{text:'黎族', value: 19},{text:'傈僳族', value: 20},{text:'佤族', value: 21},{text:'畲族', value: 22},{text:'高山族', value: 23},{text:'拉祜族', value: 24},{text:'水族', value: 25},{text:'东乡族', value: 26},{text:'纳西族', value: 27},{text:'景颇族', value: 28},{text:'柯尔克孜族', value: 29},{text:'土族', value: 30},{text:'达斡尔族', value: 31},{text:'仫佬族', value: 32},{text:'羌族', value: 33},{text:'布朗族', value: 34},{text:'撒拉族', value: 35},{text:'毛南族', value: 36},{text:'仡佬族', value: 37},{text:'锡伯族', value: 38},{text:'阿昌族', value: 39},{text:'普米族', value: 40},{text:'塔吉克族', value: 41},{text:'怒族', value: 42},{text:'乌孜别克族', value: 43},{text:'俄罗斯族', value: 44},{text:'鄂温克族', value: 45},{text:'德昂族', value: 46},{text:'保安族', value: 47},{text:'裕固族', value: 48},{text:'京族', value: 49},{text:'塔塔尔族', value: 50},{text:'独龙族', value: 51},{text:'鄂伦春族', value: 52},{text:'赫哲族', value: 53},{text:'门巴族', value: 54},{text:'珞巴族', value: 55},{text:'基诺族', value: 56}]" modal="false"
					option="{textField:'text',valueField:'text',onLoadClick:true, required: true}" defaultText="名族">
				</div>
			</div>
			<div class="row">
				<input id="bornL" name="bornL" value="" class="input" placeholder="出生年月(例：1992年09月27日)" option="{required: true}" />
			</div>
			<div class="row">
				<input name="address" value="" class="input" placeholder="身份证地址" option="{required: true}" />
			</div>
			<div class="row">
				<input name="twoCard" value="" class="input" placeholder="身份证号码" maxlength="18" option="{required: true}" />
			</div>
			<div class="row">
				<input name="endDate" value="" class="input" placeholder="租住截止日期" option="{required: true}" />
			</div>
			<div class="row">
				<input name="phone" value="" class="input" placeholder="手机号" option="{required: true}" />
			</div>
		</div>
		<div class="button-bar center">
			<input type="submit" value="保存" class="submit" />
		</div>
	</form>
	<div class="button-bar center">
		<div class="button-bar center fixed bottom">
			<input type="button" value="返回房屋人员" class="submit" onclick="grantList()" />
		</div>
	</div>
</body>
</html>